// body {
//   padding: 0;
//   margin: 0;
// }
.main {
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 100;
  .logo {
    width: 2.933333rem;
    height: 1.36rem;
    background-image: url(../images/sl2x.png);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    top: 1.733333rem;
    left: 50%;
    margin-left: -1.466667rem;
  }
  .content {
    width: 74.67%;
    height: 42.12%;
    background-color: rgba(255, 255, 255, 1);
    position: absolute;
    top: 17.73%;
    left: 12.665%;
    border-radius: .266667rem;
    box-shadow: 0 0 .106667rem 0 rgba(96,255,187,1);
    border:.08rem solid;
    border-image: linear-gradient(180deg, rgba(178,243,213,1), rgba(61,230,158,1)) 6 6;

    .head {
      width: 25%;
      height: 0;
      padding-bottom: 25%;
      background-color: rgba(216, 216, 216, 1);
      border-radius: 100%;
      margin:  10.23% auto 1.11%;
      overflow: hidden;
    }
    .nickname {
      font-weight: 600;
      color: rgba(50, 50, 50, 1);
      text-align: center;
      margin-bottom: 1.35%;
      text-shadow: 0 0 #000;
    }
    .qr-code {
      width: 4rem;
      height: 4rem;
      margin: 0 auto;
      background-color: rgba(216, 216, 216, 1);
    }
  }
}
[data-dpr="1"] {
  .nickname {
    font-size: 16px;
    line-height: 22px;
  }
}
[data-dpr="2"] {
  .nickname {
    font-size: 32px;
    line-height: 44px;
  }
}
[data-dpr="3"] {
  .nickname {
    font-size: 48px;
    line-height: 66px;
  }
}